<div ng-controller="personCtrl">
<div id="hh" >
    <i class="fa fa-fw fa-bars col-md-2" ></i>
    <div class="col-md-10" >创建订单</div>
</div>

<br>
<br>
<br>
<form class="form-inline " role="form" id="para" >
    <div class="form-group">
        <label>订单名称&nbsp;&nbsp;&nbsp;</label>
        <input type="text" class="form-control" style="text-align:center;width:300px"
               placeholder="请输入名称">
    </div>
</form>
<br>
<br>
<!-- 按钮触发模态框 -->
    <div class="row">
<button class="btn btn-info" data-toggle="modal" data-target="#myModal" id="button">
    添加产品
</button>
<!-- 模态框（Modal） -->
<div class="modal " id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"
>
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"
                        aria-hidden="true">×
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    产品种类数量
                </h4>
            </div>
            <div class="modal-body" >
                <form id="modal-body">
                    产品a数量&nbsp; <input type="text" name="number" ng-model="name" style="text-align:center">&nbsp;备注&nbsp;
                    <input type="text" name="remark" ng-model="remark1" style="text-align:center" placeholder="备注">
                    <br>
                    <br>
                    产品b数量&nbsp; <input type="text" name="number" ng-model="name2" style="text-align: center">&nbsp;备注&nbsp;
                    <input type="text" name="remark" ng-model="remark2" style="text-align:center" placeholder="备注">
                    <br>
                    <br>
                    产品c数量&nbsp; <input type="text" name="number" ng-model="name3" style="text-align: center">&nbsp;备注&nbsp;
                    <input type="text" name="remark" ng-model="remark3" style="text-align:center" placeholder="备注">
                </form>

                <button class="btn btn-success" ng-click="resetnumber()">重置数量</button>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default"
                        data-dismiss="modal">关闭
                </button>
                <button type="button" class="btn btn-default " data-dismiss="modal" >
                    确定
                </button>
            </div>

        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<button type="button" class="btn btn-success" id="button1" >确认提交</button>
    </div>
<div class="content" style="width: 80%;margin:20px auto">
    <table class="table table-hover table-striped">
        <thead>
        <tr>
            <th>产品名称</th>
            <th>数量</th>
            <th>备注</th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <th scope="row">a</th>
            <td>{{name}}</td>
            <td>{{remark1}}</td>
        </tr>
        <tr>
            <th scope="row">b</th>
            <td>{{name2}}</td>
            <td>{{remark2}}</td>
        </tr>
        <tr>
            <th scope="row">c</th>
            <td>{{name3}}</td>
            <td>{{remark3}}</td>
        </tr>
        </tbody>
    </table>
</div>
</div>